<template>
  <div>
    <a-card style="width: 100%"
            :body-style="{padding: 0}">
      <h3 slot="title">Service Vulnerabilities</h3>
      <div slot="extra" style="width: 500px">
        <a-input-search style="width: 370px; margin-right: 30px"
                        v-model="searchWord"
                        @change="onSearchChange"
                        @search="onSearchChange"
                        placeholder="Search Target"></a-input-search>
        <a-button type="primary" icon="reload" @click="window.location.reload()">Reload</a-button>
      </div>
      <a-table :dataSource="serviceData"
               :expandRowByClick="true"
               rowKey="id"
               @expand="onExpand"
               :loading="tableLoading"
               :pagination="false">
        <div slot="expandedRowRender"
             slot-scope="record"
             style="margin: 0">
          <a-descriptions bordered
                          class="expand-detail"
                          :column="1"
                          size="middle">
            <a-descriptions-item v-for="item in record.expand"
                                 :key="item.key"
                                 :label="item.key"
                                 :span="1">
              <pre>{{item.value}}</pre>
            </a-descriptions-item>
            <a-descriptions-item label="Action">
              <a @click="$emit('feedback', record)">这是误报？点击反馈</a>
              <br/><br/>
              <a @click="$emit('download', record)">下载本条数据</a>
            </a-descriptions-item>
          </a-descriptions>
        </div>
        <a-table-column
          title="Target"
          key="target"
          :sorter="(a,b)=>a.hostPort.localeCompare(b.hostPort)">
          <template slot-scope="record">
            <span>{{record.hostPort}}</span>
          </template>
        </a-table-column>
        <a-table-column title="PluginName / VulnType"
                        class="filter-column"
                        key="plugin"
                        :sorter="(a,b) => (a.plugin+a.vuln_class).localeCompare(b.plugin + b.vuln_class)"
                        :filters="vulnTypes"
                        @filter="(value, record) => record.plugin.includes(value)">
          <template slot-scope="record">
            {{record.plugin + (record.vuln_class ? `/${record.vuln_class}` : '')}}
          </template>
        </a-table-column>
        <a-table-column title="CreateTime"
                        key="create_time"
                        :sorter="(a, b) => a.create_time - b.create_time">
          <template slot-scope="record">
            {{ record.create_time | humanize }}
          </template>
        </a-table-column>
      </a-table>
    </a-card>

  </div>
</template>

<script>
  export default {
    name: "service-vulnerability",
    mounted () {
      this.init()
    },
    props: {
      data: Array,
      loading: Boolean,
    },
    data () {
      return {
        window: window,
        searchWord: "",
        serviceData: [],
        tableLoading: this.loading,
      }
    },
    methods: {
      init () {
        for (let vuln of this.data) {
          console.log(vuln);
          vuln.hostPort = `${vuln.target.host}:${vuln.target.port}`
        }
        this.serviceData = this.data
      },
      onSearchChange () {
        let serviceData = []
        for (let vuln of this.data) {
          if (vuln.hostPort.includes(this.searchWord)) {
            serviceData.push(vuln)
          }
        }
        this.serviceData = serviceData
      },
      onExpand (expanded, record) {
        if (record.expand) {
          return
        }
        let detail = record.detail
        let expand = []

        let blankList = ["host", "port"]
        let shouldIgnore = function (word) {
          for (let s of blankList) {
            if (word.includes(s)) {
              return true
            }
          }
          return false
        }
        let extra = {}
        for (let [k, v] of Object.entries(detail)) {
          if (shouldIgnore(k)) {
            continue
          }
          extra[k] = v
        }
        if (extra.length !== 0) {
          expand.push({
            key: "Extra",
            value: extra
          })
        }
        record.expand = expand
      }
    },
    computed: {
      vulnTypes () {
        let s = new Set();
        for (let vuln of this.serviceData) {
          s.add(vuln.plugin)
        }
        let result = []
        for (let t of s.values()) {
          result.push({text: t, value: t})
        }
        return result
      }
    },
    watch: {
      data (newData, old) {
        this.serviceData = newData;
        this.init()
      },
      loading (newData) {
        this.tableLoading = newData
      }
    }
  }
</script>